var timer=null;
var offset=3000;
var y=0;	
var q=-1;
var size = 0;
var divisor = 0;
$(function(){
	size = $("#size").val();
	divisor = 100/size;
	$(".roll").css("width",divisor+"%");
	$(".mid01_box").css("width",size*100+"%");
	rolltab();									
	roll();
});

function rolltab(){
	q++;				
	if(q>size-1){
		q=0	
	}
	tab(q);
	timer=window.setTimeout(rolltab,offset)			
}
function tab(e){
	var t=-(divisor*e)+"%";	
    /*
	 * 谷歌浏览器
     */		
	$('.mid01_box').css({'-webkit-transform':"translate("+t+")",'-webkit-transition':'300ms linear'} );						
	/*
	 * 火狐浏览器
	 */
	$('.mid01_box').css({'-moz-transform':"translate("+t+")",'-moz-transition':'300ms linear'} );						
	/*
	 *红点的操作
	 */
	$('.dot_line').each(function(){
		$(this).find('li').eq(e).addClass('on');
		$(this).find('li').eq(e).siblings().removeClass('on');
	})	
}
function roll(){
	$(".roll").each(function(){				
		$(this).swipe({			
			swipeLeft:function(){
				clearTimeout(timer);
				q = $(this).prevAll().length+1;
				tab(q);
				timer = window.setTimeout(rolltab, offset);  
				var i=$(this).index();
				if(i==size-1){
					return false;
				}else{
					var n=i+1;
					y=divisor*n;
					var t=-y+"%";					
					$('.mid01_box').css({'-webkit-transform':"translate("+t+")",'-webkit-transition':'300ms linear'} );									
					$('.dot_line li').eq(n).addClass('on');
					$('.dot_line li').eq(n).siblings().removeClass('on')
				}
				
			},
			swipeRight:function() {
				clearTimeout(timer);
				q = $(this).prevAll().length-1;
				if(q==-1){
					return false;
				}
				tab(q);
				timer = window.setTimeout(rolltab, offset);
				var i=$(this).index();
				if(i==0){
					return false;	
				}else{
					var n=i-1;
					y=-divisor*n;							
					var t=y+"%";					
					$('.mid01_box').css({'-webkit-transform':"translate("+t+")",'-webkit-transition':'300ms linear'} );								
					$('.dot_line li').eq(n).addClass('on');
					$('.dot_line li').eq(n).siblings().removeClass('on')
				}					
			}
		});
	})	
}